<!DOCTYPE html>

<html lang = "en" >

<head>
    <title> Experiment </title>

    <script type = "text/javascript" src = "../js/nav.js" >
    </script>

    <script type = "text/javascript" src = "../js/set_cookie.js" >
    </script>

    <link rel = 'shortcut icon' href = '../repository/favicon.ico'>
    <link rel = 'stylesheet' type = 'text/css' href = '../css/general.css' >
    <link rel = 'stylesheet' type = 'text/css' href = '../css/exp.css' >
</head>

<body>
	<script type = "text/javascript">
        nav ( 2 ) ;
        set_cookie ( 'en' ) ;
    </script>  

    <div class = "exppage" >
        <div class = "exp" >
            <h2> Friction </h2>

            <p> Find the friction of the table. </p>

            <div class = "sub" >
                Demo
            </div>

            <button type = "button" onclick = "location.href = 'exp/friction.html'" >
                Start Experiment
            </button>
        </div>

        <div class = "exp" >
            <h2> Friction </h2>

            <p> Find the friction of the table. </p>

            <div class = "sub" >
                Demo
            </div>

            <button type = "button" onclick = "location.href = 'exp/friction.html'" >
                Start Experiment
            </button>
        </div>

        <div class = "exp" >
            <h2> Friction </h2>

            <p> Find the friction of the table. </p>

            <div class = "sub" >
                Demo
            </div>

            <button type = "button" onclick = "location.href = 'exp/friction.html'" >
                Start Experiment
            </button>
        </div>
    </div>
</body>

<footer>
    <script type = "text/javascript" src = "../js/foot.js" >
    </script>

    <p id = "foot"> Language: </p>

    <select onchange = 'location.href = this.options [ this.selectedIndex ].value' id = "lang" >
        <option value = "" selected = "selected" > English </option>
        <option value = "../zh-cn/experiment.html" > 中文简体 </option>
        <option value = "../zh-jyut/experiment.html" > 中文繁體(中國香港及澳門) </option>
        <option value = "../zh-fan/experiment.html" > 中文繁體(中國臺灣) </option>  
    </select> 
    
    <script type = "text/javascript" src = "../js/mobile.js" >
    </script>

    <script type = "text/javascript" >
        if ( window.screen.width < 500 )
        {
            document.querySelector ( ".exppage" ).style.textAlign = "center" ;

            var classlist = document.getElementsByClassName ( "exp" ) ;

            for ( var i = 0 ; i < classlist.length ; i++ )
            {
                classlist [ i ].style.fontSize = "40pt" ;
                classlist [ i ].style.width = "75%" ;
                classlist [ i ].style.overflow = "visible" ;

                classlist [ i ].querySelector ( ".sub" ).style = "transform: none; height: 75px; width: 175px"
            }

            var buttonlist = document.getElementsByTagName ( "button" ) ;

            for ( var i = 0 ; i < buttonlist.length ; i++ )
            {
                buttonlist [ i ].style.fontSize = "40pt" ;
            }
        }
    </script>
</footer>

</html>